<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>canvasAnimate</title>
    <script src="jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.js"></script>
</head>

<style>
    canvas{
        box-shadow: 0 0 10px #999;
        border:1px solid red;
    }
</style>
<body onload="draw()">


<script type="text/javascript" src="angular.min.js"></script>


<!--<script>-->
<!--var myApp = angular.module("myApp", []);-->
<!--myApp.controller("testCtrl", function($scope){-->
<!--    $scope.data = [{id:1,value:'hello'},{id:2,value:'bye'},{id:3,value:'hmmmm'}];-->
<!--    //$scope.selectValue = $scope.data[0].id;-->
<!--});-->
<!--</script>-->



<form ng-controller="testCtrl">
  <select ng-model="selectValue" ng-options="item.id as item.value for item in data"></select><br /><br />
  <div ng-switch="selectValue">
    <div ng-switch-when="1">hello</div>
    <div ng-switch-when="2">bye</div>
    <div ng-switch-when="3">hmmmm</div>
    <div ng-switch-default>ah?</div>
  </div>
</form>


<canvas id="canvas" height="300" width="400">

</canvas>

<div>
    <input type="file" id="file">
    <button onclick="upload()">上传</button>
</div>

<div onclick="openChrome()">打开</div>
</body>
</html>
<script src="./js/sha1.js"></script>
<script>
    const tests = {
        text1(){

            return new Promise((resolve, reject) => {
                setTimeout(function () {
                    resolve(console.log('1111111111'));//返回写函数里面你要执行的内容
                },3000)

            })


        },
        text2(){

            console.log('22222222222')
        },
        // 调用
            timeFN(){
                this.text1().then(() => {
                    this.text2()
                })
            },
    }
    tests.timeFN()






    function cut() {
        console.log("c动作")
        var c = new Promise( (resolve, reject) => {
            resolve("完成c动作")
        });
        return c;
    }

    function boil() {
        console.log("b动作")
        var b = new Promise(((resolve, reject) => {
            resolve("完成b动作")
        }));
        return b;
    }

    Promise.race([cut(), boil()])
        .then((res)=>{
            console.log("准备动作");
            console.log(res)
        })
        .catch((err)=>{
            console.log(err)
        });

    // const cook = new Promise(((resolve, reject) => {
    //     if(true){
    //         console.log('我是成功的动作1')
    //         resolve("我是成功的动作1")
    //     }else{
    //         reject("失败了1")
    //     }
    // }));
    var c1 = 567;
    function cook(input) {
        console.log('我是成功的动作1');
        console.log(c1);
        return new Promise((resolve, reject) => {
            console.log(input);
            c1 = 1110;
            resolve(input);

        })
    }


    function cook1(input) {
        console.log('我是成功的动作2');
        console.log(c1);
        return new Promise((resolve, reject) => {
            console.log(input);
            c1 = 2220;
            resolve(input)
        })
    }

    function getDatas() {
        return new Promise(((resolve, reject) => {
            $.ajax({
                url: 'http://116.62.147.89:3333/getAllMovie',
                success: function(data){
                    resolve (data)
                },error: function (err) {
                    reject(err)
                }
            })
        }));
    }


    const cook2 = new Promise(((resolve, reject) => {
        if(true){
            console.log('我是成功的动作3');
            resolve(12)
        }else{
            reject("失败了3")
        }
    }));


    cook2.then(getDatas).then(cook1).then(cook).catch();




    function a(){
        var aa = "a";
        function b() {
            return aa;
        }
        return b();
    }
    console.log(a());
    // var cancel = "返回";
    console.log("123");

    function openChrome(){
        var url = "http://ww.baidu.com";
        // ActiveObject仅在IE下可创建
        var objShell = new ActiveObject("WScript.Shell");

        objShell.Run("cmd.exe /c start chrome www.baidu.com",0,true);

        // 注意这里是/c，不可使用/k，否则资源不会释放
        // var cmd = "cmd.exe /c start D:\\software\\xxx\\chrome.exe " + url;
        // objShell.Run(cmd, 0, true);
    }
    // var objShell= new ActiveXObject("WScript.Shell");
    // objShell.Run("cmd.exe /c start chrome www.baidu.com",0,true);
    var obj = {};
    // obj.id = 3;
    obj.id = "2";
    // obj.password = md5("38358715");
    obj.password = "25d55ad283aa400af464c76d713c07ad";
    obj.email = "1309701836@qq.com";
    // var shalpassword = hex_sha1("1weq423");
    var arr = [];
    arr.push(obj);
    // var shalpassword = hex_sha1("1weq423");
    // console.log("hex_sha1方式加密后是："+shalpassword);
    // var arr1 = [{
    //     payName:"西瓜",
    //     pay:30,
    //     date:"2020-12-04"
    // }];
    //
    // var arrs = [{
    //         uid:3,
    //         post:"一篇文章"
    // }]

    $.ajax({
        url: 'http://localhost:8089/user/updatePassword',
        data:JSON.stringify(arr),
        type:"POST",
        contentType:'application/json',
        headers:{

        },
             success: function(data){
               console.log(data)
             }
        });
    // upload();
function upload() {
	var file = $("#file")[0].files[0];
	console.log(file)
	if(!file) file = null;
	var formData = new FormData();
	formData.append("file",file);

    $.ajax({
        // url:"http://localhost:8888/upload",
        url:"http://192.168.0.195:8088/tool/oss/homeImageUpload",
        type:'post',
        data:formData,
        contentType:false,
        processData: false,
    });
}

    var name = "Window";
    var object = {
        name : "Object",
        getNameFunc : function(){
            console.log(this.name);
            var that = this;
            function getF() {
                console.log(this.name)
            }getF();

            return function(){
                console.log(that.name)  //
            };

        }
    };

    var obj = {
        name : "Object1",
        getNameFunc : function(){
            return function(){
                object.getNameFunc()();
                console.log(this.name)  //
            };
        }
    };

    (obj.getNameFunc()());
// var peopleObj = {
// var peopleObj = {
//   "xiaoming":12,
//   "xiaohong":13
// };

function fun() {
    var num = 123;
    return function() {
        return num;
    }
}
console.log(fun());


    function draw(){
        var ctxt = canvas.getContext('2d')

       // animate 直线运动
       //      ctxt.beginPath();
            /*
                canvas动画原理
                1，绘制图像
                2，清除图像
                3，更新位置
                4，绘制图像
                5，2-3-4-2-3-4
             */
            // var x = 200,y = 100,width = 20,height = 20;
            // ctxt.fillStyle = "red";
            // ctxt.fillRect(x,y,width,height)
            // // ctxt.arc(x,y,width/2,0,Math.PI*2)
            //
            // var speedX = 2;
            // var speedY = 2;
            //
            // setInterval(function () {
            // //    清除画布
            //     ctxt.clearRect(0,0,canvas.width,canvas.height);
            //
            // //    更新位置
            //     x += speedX;
            // //    判断x的值是否大于容器最右侧或小于容器最左侧
            //     if(x>canvas.width - width){
            //         speedX *= -1
            //     }else if(x < 0){
            //         speedX *= -1
            //     }
            //
            //     y += speedY;
            //     if(y>canvas.height-height){
            //         speedY *= -1;
            //     }else if(y<0){
            //         speedY *= -1
            //     }
            //     //绘制图像
            //     // ctxt.arc(x,y,height/2,0,Math.PI*2)
            //     // ctxt.fill()
            //     ctxt.fillRect(x,y,width,height)
            // },10)


    //    关键帧动画  速度不能控制
    //             var x = 200,y = 100,width = 20,height = 20;
    //             ctxt.fillStyle = "red";
    //             ctxt.fillRect(x,y,width,height)
    //             // ctxt.arc(x,y,width/2,0,Math.PI*2)
    //             var speedX = 2;
    //             var speedY = 2;
    //         function move() {
    //         //    清除画布
    //             ctxt.clearRect(0,0,canvas.width,canvas.height);
    //
    //         //    更新位置
    //             x += speedX;
    //         //    判断x的值是否大于容器最右侧或小于容器最左侧
    //             if(x>canvas.width - width){
    //                 speedX *= -1
    //             }else if(x < 0){
    //                 speedX *= -1
    //             }
    //
    //             y += speedY;
    //             if(y>canvas.height-height){
    //                 speedY *= -1;
    //             }else if(y<0){
    //                 speedY *= -1
    //             }
    //             //绘制图像
    //             // ctxt.arc(x,y,height/2,0,Math.PI*2)
    //             // ctxt.fill()
    //             ctxt.fillRect(x,y,width,height);
    //             //请求关键帧动画
    //             window.requestAnimationFrame(move)
    //         }
    //         move();


    //    小球碰撞反弹  面向对象

        // function Ball(x,y,r,speedX,speedY,color){
        //     this.x = x;
        //     this.y = y;
        //     this.r = r;
        //     this.speedX = speedX;
        //     this.speedY = speedY;
        //     this.color = color;
        //
        //     this.draws = function () {
        //         ctxt.beginPath();
        //         ctxt.fillStyle = this.color;
        //         ctxt.arc(this.x,this.y,this.r,0,Math.PI*2)
        //         ctxt.fill()
        //     }
        //     this.move = function () {
        //         this.x += this.speedX;
        //         this.y += this.speedY;
        //         if(this.x>canvas.width-this.r){
        //             this.speedX *= -1
        //         }else if(this.x<this.r){
        //             this.speedX *= -1
        //         }
        //         if(this.y>canvas.height - this.r){
        //             this.speedY *= -1;
        //         }else if(this.y<this.r){
        //             this.speedY *= -1
        //         }
        //
        //     }
        // }
        // var ball = new Ball(100,100,20,9,3,'red')
        //
        // function startMove(){
        //     //清空画布
        //     ctxt.clearRect(0,0,canvas.width,canvas.height);
        //     ball.draws();
        //     ball.move();
        //     // ctxt.arc(this.x,this.y,this.r,0,Math.PI*2)
        //     // ctxt.fill()
        //     //请求关键帧动画
        //     window.requestAnimationFrame(startMove)
        // }
        // startMove()


    //    水平背景移动
            //     var x = 0;
            //     function backgroundMove(){
            //         //记录状态方法
            //         ctxt.save();//栈的存储方式  先进后出
            //
            //         ctxt.clearRect(0,0,canvas.width,canvas.height);
            //         ctxt.translate(-x,0);
            //         ctxt.drawImage(img,0,0);
            //         ctxt.drawImage(img,canvas.width,0);
            //
            //         x ++;
            //         if(x>=canvas.width){
            //             x = 0;
            //         }
            //         ctxt.restore()//必须先有save方法存储才能取
            //         window.requestAnimationFrame(backgroundMove)
            //
            //     }
            //     var img = new Image();
            //     img.src = "./img/b19.jpg";
            //     img.onload = function () {
            //         backgroundMove()
            //     }

    //    竖直背景移动
        //     var y = 0;
        //     function bgPto() {
        //         ctxt.save()
        //         ctxt.clearRect(0,0,canvas.width,canvas.height)
        //         ctxt.translate(0,y);
        //         ctxt.drawImage(images,0,0);
        //         ctxt.drawImage(images,0,canvas.height*-1)
        //         y ++;
        //         if(y>=canvas.height){
        //             y = 0;
        //         }
        //         ctxt.restore()
        //         window.requestAnimationFrame(bgPto)
        //     }
        //     var images = new Image();
        //     images.src = "./img/flower.gif";
        //     images.onload = function () {
        //         bgPto()
        //     }


    //    矩形横向碰撞
        //     function Rect(x,y,height,width,speed,color){
        //         this.x = x;
        //         this.y = y;
        //         this.height = height;
        //         this.width = width;
        //         this.speed = speed;
        //         this.color = color;
        //     }
        //     Rect.prototype.draw = function(){
        //         ctxt.beginPath();
        //         ctxt.fillStyle = this.color;
        //         ctxt.fillRect(this.x,this.y,this.width,this.height)
        //     }
        //     Rect.prototype.move = function(){
        //         this.x += this.speed;
        //         if(this.x > canvas.width-this.width){
        //             this.speed *= -1
        //         }else if(this.x<0){
        //             this.speed *= -1;
        //         }
        //
        //     }
        //
        //     var rect1 = new Rect(0,30,30,30,2,'red')
        //     var rect2 = new Rect(370,30,30,30,-2,'green')
        //     rect1.draw()
        //     rect2.draw()
        //     function animate() {
        //         ctxt.clearRect(0,0,canvas.width,canvas.height)
        //         rect1.draw();
        //         rect2.draw();
        //         rect1.move();
        //         rect2.move();
        //         if(isHit()){
        //             rect1.speed *= -1;
        //             rect2.speed *= -1;
        //         }
        //         window.requestAnimationFrame(animate)
        //     }
        //     animate()
        //     function isHit(){
        //         //获取最小和最大值
        //         var min1 = rect1.x;
        //         var min2 = rect2.x;
        //         var max1 = rect1.x+rect1.width
        //         var max2 = rect2.x+rect2.width
        //         var min3 = Math.max(min1,min2)
        //         var max3 = Math.min(max1,max2)
        //         if(min3<max3){
        //             return true
        //         }else{
        //             return false
        //         }
        //     }


    //    圆形的横向碰撞
    //     function Round(x,y,r,speedX,speedY,color){
    //         this.x = x;
    //         this.y = y;
    //         this.r = r;
    //         this.speedX = speedX;
    //         this.speedY = speedY;
    //         this.color = color;
    //     }
    //     Round.prototype.draw = function (){
    //         ctxt.beginPath();
    //         ctxt.fillStyle = this.color
    //         ctxt.arc(this.x,this.y,this.r,0,Math.PI*2)
    //         ctxt.fill()
    //     }
    //     Round.prototype.move = function (){
    //         this.x += this.speedX;
    //         if(this.x > canvas.width-this.r){
    //             this.speedX *= -1
    //         }else if(this.x<0+this.r){
    //             this.speedX *= -1
    //         }
    //     }
    //     var wall1 = new Round(15,50,15,-2,2,'red');
    //     var wall2 = new Round(385,50,15,2,-2,'green');
    //     wall1.draw();
    //     wall2.draw();
    //
    //     function animate(){
    //         ctxt.clearRect(0,0,canvas.width,canvas.height);
    //         wall1.draw();
    //         wall2.draw();
    //         wall1.move();
    //         wall2.move();
    //         isHit();
    //         window.requestAnimationFrame(animate)
    //     }
    //     animate()
    //     function isHit(){
    //         var min1 = wall1.x;
    //         var min2 = wall2.x;
    //         var max1 = wall1.x+wall1.r*2;
    //         var max2 = wall2.x+wall2.r*2;
    //         var min3 = Math.max(min1,min2);
    //         var max3 = Math.min(max1,max2);
    //         if(min3<max3){
    //             wall1.speedX *= -1
    //             wall2.speedX *= -1
    //         }else{
    //
    //         }
    //     }

    }
</script>
